import {
  generateHtml,
  getMarker,
  getMaxCorrectStreakStr,
  getMaxWrongStreakStr,
  getTimeAndNumberStr,
  getCorrectCountStr,
  getWrongCountStr,
  getTotalCountStr,
  getAccuracyStr,
  getPrevGroupsStr,
  getCurrentGroupsStr,
  getMaxArrayLength,
  calculateAccuracy,
  getMetricsStr
} from '@/utils/study.js'

/**
 * 格式化组准确率为HTML字符串
 * @param {Array} params - 图表系列的参数数组
 * @returns {string} - 格式化后的HTML字符串
 */
export const formatterForGroupAccuracy = function(params) {
  // 检查参数是否为非空数组，确保后续操作的安全性
  if (!Array.isArray(params) || params.length === 0) return ''

  // 从参数数组中获取第一个数据项
  const item = params[0]

  // 使用解构赋值，从 item.data 中提取所需的属性
  const {
    sourceData, // 包含号码和时间的源数据
    valueCount, // 计数数组，记录不同值出现的次数
    groupsNumber, // 当前组号码数组
    prevGroupsNumber, // 上一组组号码数组
    maxCorrectStreak, // 最大连续正确次数
    maxWrongStreak, // 最大连续错误次数
    metrics // 指标
  } = item.data

  // 获取当前数据项的颜色属性，用于后续的样式或标记
  const color = item.color

  // 将 sourceData 中的号码从字符串类型转换为数字类型，确保后续数值计算的准确性
  const number = Number(sourceData.number)

  // 根据颜色获取当前的标记，这可能是一个HTML字符串或符号，用于在生成的HTML中显示颜色相关的标记
  const currentMarker = getMarker(color)

  // 计算准确率，调用辅助函数 calculateAccuracy，并传入 valueCount 数组
  // 该函数返回一个四舍五入到两位小数的准确率百分比
  const accuracy = calculateAccuracy(valueCount)

  // 计算HTML容器的宽度
  const numberWidth = 25 // 每个号码占据的宽度（像素）
  const maxArrayLength = getMaxArrayLength(prevGroupsNumber, groupsNumber) // 获取前期和当前组号数组的最大长度
  const width = `${(maxArrayLength * numberWidth + 250) > 520 ? `${maxArrayLength * numberWidth + 250}px` : '520px'}` // 计算最终的宽度，确保内容能够正确显示和布局

  // 生成各部分的HTML
  const components = [
    // 生成日期和号码的HTML字符串
    getTimeAndNumberStr(currentMarker, sourceData.time, number, color),
    // 生成正确次数的HTML字符串
    getCorrectCountStr(valueCount, 10),
    // 生成最大连续正确次数的HTML字符串
    getMaxCorrectStreakStr(maxCorrectStreak),
    // 生成错误次数的HTML字符串
    getWrongCountStr(valueCount, 0),
    // 生成最大连续错误次数的HTML字符串
    getMaxWrongStreakStr(maxWrongStreak),
    // 生成总期数的HTML字符串
    getTotalCountStr(valueCount, 10, 0),
    // 生成准确率的HTML字符串
    getAccuracyStr(accuracy),
    // 生成上期所选组号码的HTML字符串
    getPrevGroupsStr(prevGroupsNumber, number, color),
    // 生成本期所选组号码的HTML字符串
    getCurrentGroupsStr(groupsNumber, number, color)
  ]

  // 生成指标的HTML字符串
  let metricsHtml = ''

  if(metrics) {
    metricsHtml = getMetricsStr(metrics, this.metricsOptions)
  }

  // 生成最终HTML
  return generateHtml(components, width, metricsHtml)
}
